import React, { Component } from 'react';
import Adaptive from '../component/adaptive/Adaptive';
import asyncComponent from '../../Bundle';//动态加载组件，用作代码分割
import Header from './header/Header';
import Lang  from './list/Lang.json';
import listContent from './list/listContent';
import queryString  from 'query-string';
//pc
const List = asyncComponent(() => import('./list/List'));
const Footer = asyncComponent(() => import('../component/footer/Footer'));
//mobile
const ListMobile = asyncComponent(() => import('./list-mobile/ListMobile'));
const FooterMobile = asyncComponent(() => import('../component/footer-mobile/FooterMobile'));
class System extends Component {
    render() {
        let page = queryString.parse(this.props.location.search).page;
        return (
            <div className="System" style={{overflow:"hidden"}}>
                <Header refName="service" childNodes="service-a" imgUrl={require('../solution/img/solution.jpg')}/>
                <Adaptive desktop={<List title='————源自梅奥医疗集团————' list={Lang} listContent={listContent} listPosition="left"/>} phone={<ListMobile defaultActiveKey={page}/>} size={1200}/>
                <Adaptive desktop={<Footer/>} phone={<FooterMobile/>} size={1200}/>
            </div>
        );
    }
}

export default System;
